<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet">
    <style>
        .autoAll{
            width: 80%;
            margin:20px auto;
        }
        .left{
            float: left;
        }
        .right{
            float: right;
        }
        .nav_top{
            background-color: #eef1f6;
            height: 60px;
        }
        .nav_left{
            width:70%;
            height:36px;
        }
        .nav_right{
            margin-top:12px;
            padding-right: 10px;
            width: 30%
        }
        .nav_right>input{
            height:36px;
            border:0;
            border: 1px solid #20a0ff;
            border-right:0;
            width:70%
        }
        .nav_right>Button{
            border-radius: 0;
            width:30%
        }
        .contentMain{
            width: 100%;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4;
            overflow: hidden;
            height:60px;
        }
        .navbar-inverse .navbar-nav>li>a.active{
            color:#fff;
            font-size: 18px
        }
        #top{
            height: 51px;
        }
        #logo{
            font-size: 30px;
            color:#0D0D0E;
            font-family: "楷体"

        }
        .menuTitle{
            height: 30px;
            font-size: 25px;
            color: black;
            text-align: center;
            width: 500px;
            margin:5px auto;
            border-bottom: 2px solid black;
            position: relative;
            margin-bottom: 20px;
        }
        .menuTitle>p{
            position: absolute;
            background: #fff;
            width:120px;
            height:50px;
            left: 50%;
            top: 50%;
            margin-left:-60px;
            margin-top:-5px;
        }
        .clearfix:after{content:"";display:block;clear:both;height:0;overflow:hidden;visibility:hidden}
        .page-header{
            width: 80%;
            margin:20px auto;
            border-bottom: 1px solid black;
        }
        .page-header>.pull-left{
            font-size: 25px;
            font-family: "楷体"
        }
        .page-header>.pull-right{
            font-size:14px;
            margin-top:10px
        }

        li{
            list-style: none
        }


        .media:hover{
            /* border: */
            outline: #C60 1px solid;
        }
        .thumbnail:hover{
            outline: red 2px solid;
        }
        .newsImg{
            width:150px;height:120px;
        }
        .newsContent{
            padding-left:10px;
            padding-right:10px
        }
        .media{
            margin:30px 0;
            cursor:pointer;
            padding: 5px;
            box-sizing: border-box;
        }
        .news_content{
            height:60px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4;
            overflow: hidden;
        }
        .comNum{
            margin-right:20px;
            color:#888
        }
        .content_bot{
            background-color: #eef1f6;
            height: 60px;
            padding-right:10px;
        }
        .page{
            margin-top:-5px;
        }

        .thumbnail>.goodsImg{
            width:100%;
            height:250px;
            border-bottom:1px dashed #888
        }
        .priceColor{
            color:red;
            font-size:20px
        }
        .l_color{
            color:#C60;
        }
        .r_color{
            color:#888
        }
        .goodsCont{
            height:40px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4;
            overflow: hidden;
        }

        .down_num{
            border:1px solid black;
            padding:2px 6px;
            border-right:0;
            cursor:pointer
        }
        ._num{
            border:1px solid black;
            padding:2px 6px;
            border-right:0;
        }
        .up_num{
            border:1px solid black;
            padding:2px 6px;
            cursor:pointer
        }
        .carts .carts_bottom{
            margin-top: -20px;
            padding-top:13px;
            padding-left:20px;
            padding-right:20px;
        }
        .all_price{
            line-height:34px;
            font-size:20px;    
        }
        .mon{
            color:red
        }


        #newsDetails{margin: 15px 80px;margin-top: 30px;}
        #newsDetails h3{margin: 30px 0;text-align: center}
        #newsDetails .time{text-align: center;}
        #newsDetails .time .bj{margin-right: 50px;}
        #newsDetails img{width:600px;margin: 20px;}
        #newsDetails .img{text-align: center}
        .newsCom{text-indent: 34px;font-size: 18px}
        #newsDetails h4{border-top:2px solid #333; margin:20px 0;padding-top:10px;}
        #newsDetails .comment{padding: 0px 30px 10px;width:100%;overflow: hidden;border-bottom: 1px dashed #888;margin-bottom:15px}
        #newsDetails .comment span{margin-right: 50px;}


        #foot{background:#101010;padding:40px 0 27px 0;text-align:center;position:relative}
        #foot ul{width:720px;padding-top:10px;margin:0 auto}
        #foot li{float:left;border-right:1px #fff solid;line-height:15px;padding:0 10px 0 13px;margin-bottom:13px}
        #foot li a{color:#fff;font-size:12px;}
        #foot li:nth-last-of-type(1){border:0}
        #foot li a:hover{text-decoration:underline;}
        #foot p{width:705px;margin:0 auto;font-size:12px;color:#fff;text-align:center;margin-bottom:12px}
        #foot p em{padding:0 10px;font-style:normal}
        #foot p a{color:#fff;padding:0 10px;border-left:1px solid #fff;border-right:1px solid #fff}
        /* #foot p a:hover{text-decoration:underline} */
        #foot>div em{display:block;font-style:normal;color:#fff;font-size:12px;line-height:13px;}
        #foot>i a{display:block;width:40px;height:40px;position:absolute;top:32px;left:573px;background:url(../img/icons.fw.png) no-repeat 2px -339px}
        #foot>strong a{display:block;width:40px;height:40px;position:absolute;top:32px;left:635px;background:url(../img/icons.fw.png) no-repeat 3px -393px}
        #foot>i b{font-weight:100;font-size:12px;padding:110px 15px 10px;position:absolute;top:-110px;left:535px;background:#fff url(../img/ewm.jpg) no-repeat 10px 10px;z-index:1;display:none}
        /* #foot>i:hover b{display:block} */
        #foot>strong b{font-weight:100;font-size:12px;padding:110px 15px 10px;position:absolute;top:-110px;left:600px;background:#fff url(../img/ewm.jpg) no-repeat 10px 10px;z-index:1;display:none}
        /* #foot>strong:hover b{display:block} */

    </style>
</head>
<body>
    <div id="app"></div>
    <script src="./bundle.js"></script>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>

<script>

</script>